<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<!-- 公共头部引入 header.html -->
<head th:replace="common/header"></head>
<style>
    .layui-slider-input {
        top: 0px;
    }

    .layui-slider {
        top: 15px;
    }

    .select-test {
        position: absolute;
        /*max-height: 500px;*/
        /*height: 350px;*/
        overflow: auto;
        width: 100%;
        z-index: 123;
        display: none;
        border: 1px solid silver;
        top: 42px;
    }

    .layui-show {
        display: block !important;
    }

    .dtree-menubar .layui-btn-group .layui-btn-sm i {
        font-size: 20px !important;
        height: 26px;
    }
</style>
<body>
<!--<div class="layui-container butvalue">-->
<!--    <div class="layui-fluid">-->
<div style="overflow: auto">
    <form class="layui-form" action="" id="queryForm" style="max-width: 60%;margin: 30px auto;"
          shiro:hasPermission="system:local:detail">
        <blockquote class="layui-elem-quote sure-quote">安全加密服务配置</blockquote>
        <div class="layui-form-item">
            <label class="layui-form-label required-label">设备型号<span style="color: red">*</span></label>
            <div class="layui-input-block">
                <input type='text' name="provider" id="provider" lay-verType="tips"
                       lay-verify="required" placeholder="加密设备型号" autocomplete="off"
                       class="layui-input" th:value="${provider}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required-label">证书编号<span style="color: red">*</span></label>
            <div class="layui-input-block">
                <input type='text' name="cert_sn" id="cert_sn" lay-verType="tips"
                       lay-verify="required|lenStrNum" placeholder="安全证书编号" autocomplete="off"
                       class="layui-input" th:value="${cert_sn}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required-label">服务ip<span style="color: red">*</span></label>
            <div class="layui-input-block">
                <input type='text' id="ip" name="ip" lay-verType="tips" lay-verify="required"
                       placeholder="" autocomplete="off" class="layui-input" th:value="${ip}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required-label">服务端口<span style="color: red">*</span></label>
            <div class="layui-input-block">
                <input type='text' name="port" id="port" lay-verify="required|num"
                       lay-verType="tips"
                       placeholder="所属行政区域码"
                       autocomplete="off" class="layui-input" th:value="${port}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">服务状态<span style="color: red">*</span></label>
            <div class="layui-input-inline">
                <input type="checkbox" id="status" th:checked="${status}" name="status" lay-skin="switch" lay-filter="statusTest" lay-text="开启|关闭">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">签名状态<span style="color: red">*</span></label>
            <div class="layui-input-inline">
                <input type="checkbox"id="signature" th:checked="${signature}" name="signature" lay-skin="switch" lay-filter="signatureTest" lay-text="开启|关闭">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">验签状态<span style="color: red">*</span></label>
            <div class="layui-input-inline">
                <input type="checkbox" id="attestation" th:checked="${attestation}" name="attestation" lay-skin="switch" lay-filter="attestationTest" lay-text="开启|关闭">
            </div>
        </div>

        <div style="margin: 0 0 0 50%;">
            <button shiro:hasPermission="safety:encryption:edit" type="button" class="layui-btn" lay-submit="safetyConfig"
                    lay-filter="safetyConfig">保存设置
            </button>
        </div>
    </form>
</div>
<!--</div>-->
<!-- js部分 -->

<script type="text/javascript" th:inline="javascript">
    var parentId = $(".butvalue").attr("parentId");
    layui.use(['jquery', 'layer', 'form', 'formSelects', 'admin', 'slider', 'element'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var dtree;
        var admin = layui.admin;
        var slider = layui.slider;
        form.render();
        form.on("submit(safetyConfig)", function (data) {
            let provider = $('#provider').val();
            let cert_sn = $('#cert_sn').val();
            let ip = $('#ip').val();
            let port = $('#port').val();
            let status = $('#status').is(":checked");
            let signature = $('#signature').is(":checked");
            let attestation = $('#attestation').is(":checked");

            admin.ajax({
                url: '/safety/encryption/editData',
                type: 'POST',
                data: {
                    provider: provider,
                    cert_sn: cert_sn,
                    ip: ip,
                    port: port,
                    status: status,
                    signature: signature,
                    attestation: attestation,
                },
                //dataType:'json',
                success: function (data) {
                    if (data.success) {
                        layer.msg(data.msg, {icon: 1, shade: 0.4, time: 1500});
                        setTimeout('window.location.reload()', 1500);
                        form.render();
                    } else {
                        setTimeout('window.location.reload()', 1500);
                        form.render();
                        layer.msg(data.msg, {icon: 2, shade: 0.4, time: 1500});
                    }
                },
                error: function (error) {
                    layer.msg("网络异常，请稍后尝试!", {icon: 2, shade: 0.4, time: 1500});
                }
            });

            return false;
        });


        form.verify({
            ip: function (value, item) { //value：表单的值、item：表单的DOM对象
                if (!new RegExp("^(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9]):(\\d{1,5})$").test(value)) {
                    return '请输入正确的IP地址!';
                }
            },
            num: function (value, item) { //value：表单的值、item：表单的DOM对象
                if (!new RegExp("^\\d+$").test(value)) {
                    return '必须是全数字!';
                }
            },
            zbj: function (value, item) { //value：表单的值、item：表单的DOM对象
                var reg = /^[\-\+]?(0(\.\d{1,10})?|([1-9](\d)?)(\.\d{1,10})?|1[0-7]\d{1}(\.\d{1,10})?|180\.0{1,10})$/;
                if (!reg.test(value)) {
                    return '请输入正确经度坐标(支持小数点后6位)!';
                }
            },
            zbw: function (value, item) { //value：表单的值、item：表单的DOM对象
                var reg = /^[\-\+]?((0|([1-8]\d?))(\.\d{1,11})?|90(\.0{1,11})?)$/;
                if (!reg.test(value)) {
                    return '请输入正确经度纬度(支持小数点后6位)!';
                }
            },
            lenStr: function (value, item) {
                if (value.length != 4) {
                    return "型号编号限制4位字符!";
                }
            },
            lenStrNum: function (value, item) {
                if (value.length != 12) {
                    return "限制12位字符!";
                }
            },
            lenStrTwentyFour: function (value, item) {
                if (value.length != 23) {
                    return "设备资源编码限制23位字符!";
                }
            },
        });

    });
</script>
</body>
</html>